<template>
  <div class="personal-info">
    <h2>个人信息</h2>
<!--    <el-table :data="personalInfo" border>-->
<!--      <el-table-column prop="username" label="姓名" :key="itemKey"> </el-table-column>-->
<!--      <el-table-column prop="age" label="年龄" :key="itemKey"></el-table-column>-->
<!--      <el-table-column prop="email" label="邮箱" :key="itemKey"></el-table-column>-->
<!--    </el-table>-->
    <p>用户名：{{username}}</p>
    <p>电话：{{userphone}}</p>
<!--    <h1>{{username}}</h1>-->
<!--    <h1>{{age}}</h1>-->
<!--    <h1>{{email}}</h1>-->
  </div>
</template>

<script>
import { ref, onMounted } from 'vue';

export default {
  data: function () {
    return {
      username: "zhangsan",
      userphone: 1333333333,
    }
  },
  mounted() {
    this.setUsername()
  },
  methods: {
    setUsername() {
      var _this = this;
      _this.username = localStorage.getItem('loginusername')
      _this.userphone = localStorage.getItem('loginuserphone')

      let token = localStorage.getItem('token')

    },
  }




  //name: 'PersonalInfo',
  // setup() {
  //   const personalInfo = ref([]);
  //
  //   const loadPersonalInfo = () => {
  //     // 模拟从后端加载个人信息的过程，这里使用静态数据进行示例
  //     const data = [
  //       {
  //         // eslint-disable-next-line no-undef
  //         name: zhangshan,
  //         age: 25,
  //         email: 'zhangsan@example.com'
  //       },
  //       {
  //         name: '李四',
  //         age: 30,
  //         email: 'lisi@example.com'
  //       }
  //       // 可以根据实际情况添加更多的个人信息数据
  //     ];
  //     personalInfo.value = [...data];
  //   };
  //
  //   onMounted(() => {
  //     // eslint-disable-next-line no-undef
  //     loadPersonalInfo();
  //   });
  //
  //   return {
  //     personalInfo
  //   };
  // }
};
</script>

<style scoped>
.personal-info {
  max-width: 400px;
  margin: 0 auto;
}
</style>

